<template>
   <div class="main">
     <div>
         <el-tabs v-model="activeName" @tab-click="handleClick">
           <el-tab-pane label="用户管理" name="first">用户管理</el-tab-pane>
           <el-tab-pane label="配置管理" name="second">配置管理</el-tab-pane>
           <el-tab-pane label="角色管理" name="third">角色管理</el-tab-pane>
           <el-tab-pane label="定时任务补偿" name="fourth">定时任务补偿</el-tab-pane>
         </el-tabs>
     </div>
     <div class="lunbo">
        <el-carousel :interval="4000" type="card" height="400px">
        <el-carousel-item v-for="item in imgs" :key="item">
          <div class="item "><img :src='item'></div>
        </el-carousel-item>
      </el-carousel>
     </div>
    </div>

</template>

<script>
  export default {
    data(){
      return{
      imgs:['../../../static/imgs/2.jpg','../../../static/imgs/3.jpg','../../../static/imgs/4.jpg']
      }
    },
    mounted:function(){

    },
    methods:{

},
}
</script>

<style>
           .lunbo .el-carousel__item .item img {
              margin: 0;
              width: 100%;
              height: 510px;
            }
            .el-carousel__item:nth-child(2n) {
              background-color: #99a9bf;
            }

            .el-carousel__item:nth-child(2n+1) {
              background-color: #d3dce6;
            }
            .lunbo{
              width: 80vw;
              margin: auto;
            }
</style>
